<script>
export default {
    name: 'TXZ_position',
};
</script>
<script setup>
import { computed, reactive, ref, onDeactivated } from 'vue';
import { ElMessage } from 'element-plus';
import Type from '@components/search/type';
import Search from '@components/search/index';
import PageWrapper from '@components/PageWrapper.vue';
import { common, service } from '@utils';
import { Plus} from '@element-plus/icons-vue';
import { usePremission } from '@hooks';
import EditCom from './Edit';
import store from '@store';
const premission = usePremission({
    edit: 'manager:orgGroup:update',
    delete: 'manager:orgGroup:delete',
    add: 'manager:orgGroup:save',
});
const searchs = ref([
    {
        type: Type.INPUT,
        key: 'name',
        width: 5,
        placeholder: '组别名称',
        data: [],
    },
    {
        width: 6,
        type: Type.SEARCH_BUTTON,
    },
]);

const pageRef = ref();
const tableRef = ref();
const editRef = ref();

const companyCode = computed(() => store.getters.user);

let queryForm = reactive({});
// code: (companyCode.value.companyCode = 'platform' ? '' : companyCode.value.companyCode),
const onSearch = param => {
    delete param.time;
    queryForm = param;
    pageRef.value.refresh();
};
window.addEventListener('beforeunload', e =>  window.sessionStorage.removeItem('orgGroupsName'))
let query = window.sessionStorage.getItem('orgGroupsName');
// onDeactivated(()=>{
//     window.removeEventListener(console.log(123))
// })
if (query) {
    queryForm.name = query;
}
const getTree = async () => {
    const res = await service.auth.osysorgTree();
    if (res.resultCode == 8200) {
        searchs.value[0].data = res.data;
    }
};
const getData = async ({ pageNum, pageSize }, cb) => {
    const res = await service.auth.orgGroupPage(pageNum, pageSize, queryForm);
    cb(res);
    setTimeout(() => {
        tableRef.value.scrollTo(0, 0);
    }, 0);
};
const deleteBtn = async id => {
    const res = await service.auth.orgGroupPageDelete({ id: id });
    if (res.resultCode == 8200) {
        searchs.value[0].data = res.data;
        pageRef.value.refresh(true);
        ElMessage.success('删除成功');
    }
};
const width = (function (premission) {
    let width = 24;
    premission.view && (width += 33);
    premission.edit && (width += 33);
    premission.delete && (width += 33);
    return Math.max(width, 80);
})(premission);
</script>
<template>
    <section class="main-white">
        <search :items="searchs" @filter="onSearch" />
        <div class="margin-bottom10" v-if="premission.add">
            <el-button type="primary" :icon="Plus" @click="editRef.open('新增', {})">新增组别</el-button>
        </div>
        <page-wrapper @get-data="getData" ref="pageRef">
            <template v-slot:default="props">
                <vxe-table class="mytable-scrollbar" ref="tableRef" :loading="props.loading" :data="props.tableData.records" :max-height="common.tableHeight(true, premission.add ? 1 : 1)" highlight-hover-row align="center" round stripe border>
                    <vxe-column field="name" title="组别名称" width="150" />
                    <vxe-column field="code" title="唯一编码" width="150" />
                    <vxe-column field="sort" title="排序" width="150" />
                    <vxe-column field="city" title="城市" width="150" />
                    <vxe-column field="vehiclesUnderName" title="名下车辆情况" width="150" />
                    <vxe-column field="propertyUnderName" title="名下房产情况" width="170" />
                    <vxe-column field="accumulationFund" title="公积金信息" width="170" />
                    <vxe-column field="sesameSeed" title="芝麻分情况" width="170" />
                    <vxe-column field="realName" title="是否实名" width="170" />
                    <vxe-column field="preconditionsRisk" title="前置风控" width="170" />
                    <vxe-column field="minimumRepayment" title="近1个月还款成功总金额不低于（元）" width="270" />
                    <vxe-column field="maximumOverdue" title="近12个月逾期笔数不超过（笔）" width="170" />
                    <vxe-column title="操作" :width="width + 88" fixed="right">
                        <template #default="{ row }">
                            <section class="operateBtn">
                                <span v-if="premission.edit" @click="editRef.open('编辑', row, searchs[0].data)">编辑</span>
                                <el-popconfirm v-if="premission.delete" title="确定删除？" @confirm="deleteBtn(row.id)">
                                    <template #reference>
                                        <span>删除</span>
                                    </template>
                                </el-popconfirm>
                            </section>
                        </template>
                    </vxe-column>
                </vxe-table>
            </template>
        </page-wrapper>
        <edit-com ref="editRef" @refresh="flag => pageRef.refresh(flag)" @getTree="getTree()" />
    </section>
</template>
<style lang="scss" scoped>
.operateBtn {
    display: flex;
    justify-content: space-evenly;
    color: #ccc;
    padding: 0px 20px;
    span {
        color: orangered;
        cursor: pointer;
    }
}
.pointerText {
    cursor: pointer;
}
</style>
